<template>
  <div id="AsnDetailList">
    <v-tableTitle :btnConfig="btnConfig"
                  :tableSelectData="selectData"
                  @addUmenu="addUmenu"
                  @del="del"
                  @backList='backList'
                  @poFill="newCreate"
                  @btnTableData="btnTableData"></v-tableTitle>
    <div class="detail">
      <component :data="{detailData,argument}"
                 :is="currentComponent"></component>
    </div>
  </div>

</template>

<script>
import tableTitle from "commons/TableTitle";
import navMenu from "commons/NavMenu";
import baseMixin from "@/mixins/BaseMixin";
import config from "../Config"

export default {
  name: "DetailList",
  mixins: [baseMixin],
  data () {
    return {
      newFlag: false,
      detailsFlag: false,
      argument: {},
      detailData: {},
      selectData: [],
      detailNav: "1",
      settingFlag: true,
      componentConfig: [
        {
          name: "detailTable",
          label: "",
          component: () => import('./page/umenu_list.vue')
        },
        {
          name: "OrdersTitle",
          label: "",
          component: () => import('./page/umenu_mxList.vue')
        },
      ],
      page: 1
    }
  },
  computed: {
    btnConfig () {
      if (this.detailNav == 1) {
        return [
          {
            label: this.$t('security.addChildMenu'), certigier: this.$parent.addStatus, invalid: "addUmenu"
          },
          { label: this.$t('security.delChildMenu'), certigier: this.$parent.deleteRoleStatus, disabled: true, invalid: "del" },
        ]
      } else if (this.detailData.isprocess == 1) {
        return [
          { label: this.$t('common.return'), invalid: "backList" },
          {
            type: "table", label: this.$t('security.setRole'), invalid: "po", tableConfig: [
              {
                label: this.$t('security.roleName'),
                prop: "name",
                input: "input",
              },
              {
                label: this.$t('security.roleDesc'),
                prop: "description",
                input: "input",
              }
            ]
          },
        ]
      } else {
        return [
          { label: this.$t('common.return'), invalid: "backList" },
        ]
      }


    },
    currentComponent () {
      return this.componentConfig[this.detailNav - 1].component;
    }
  },
  methods: {
    async newCreate (data) {
      this.$api.get(`/insertRoleAndMenu/${this.detailData.selfid}/${data.id}`).then(res => {
        
          this.$message.success(res.returnMgr);
        
      })
    },
    backList () {
      this.detailNav = '1'
    },
    async btnTableData (page, date, callback) {
      let url = "/role/"
      try {
        let res = await this.$api.post(`${url}${page}`, date);
        callback(res);
      } catch (e) {
        this.$message.error(e);
      }
    },
    //删除数据
    async del (data) {
      this.$api.post(`/deleteUmenu`, data).then(res => {
        
          this.$message.success(res.returnMgr);
          this.$children[1].getTableData(1, {});
          this.$children[1].$refs.table.delSelectData(data);
        
      })
    },
    //选中的数据
    setSelectData (data) {
      this.selectData = data;
    },
    async setdialog (data) {
      try {
        let res = await this.$api.post(`/queryUmenuByUmenuKey`, data);
        
          this.detailData = res.bean;
          this.detailNav = '2'
          this.settingFlag = false;
        
      } catch (e) {
        this.$message.error(e);
      }
    },
    addUmenu () {
      this.settingFlag = true;
      this.$store.commit("setNewFlag", true);
      this.detailData = {
        wmwhse: '',
        name: '',
        description: '',
        parentid: '',
        selfid: '',
        isrf: '',
      }
      this.detailNav = '2'
    }
  },
  mounted () {
    if (Object.keys(this.$store.state.skip).length !== 0) {
      let data = this.$store.state.skip;
      this.argument = data.routeData;
      this.detailData = data.detailList;
      this.detailNav = data.detailListNav;
    } else {
      this.argument = this.$store.state.routeData;
    }

  },
  components: {
    "v-tableTitle": tableTitle,
    "v-navMenu": navMenu,
  },
  watch: {
    selectData (data) {
      if (this.$parent.permissionStatus) {
        if (data.length > 0) {
          this.$parent.deleteRoleStatus = false;
        } else {
          this.$parent.deleteRoleStatus = true;
        }
      }
    }
  }
}
</script>

<style>
</style>
